<template>
  <a-modal v-model:visible="visibleSmallModal1" :title="`企业类型码表(${props.smallModalId})`" :footer="null" @cancel="handleCancel()">
    <a-table
      bordered
      class="ant-table-striped"
      size="middle"
      :data-source="dataSource"
      :columns="columns"
      :row-class-name="(_record: any, index: number) => (index % 2 === 1 ? 'table-striped' : null)"
    >
    </a-table>
    <template #footer> </template>
  </a-modal>
</template>
<script setup lang="ts">
  import { reactive, ref, onMounted } from 'vue';
  // import tableComponent from './tableComponent.vue';
  import type { Ref } from 'vue';
  import { string } from 'vue-types';
  const props = defineProps({
    keys: {
      type: String,
    },
    isOperate: {
      type: Number,
    },
    smallModalId: {
      type: String,
    },
    visibleSmallModal: {
      type: Boolean,
    },
    tableSmallModal: {
      type: Array,
      default: () => {
        return [];
      },
    },
  });
  let key: Ref<number> = ref(999);
  interface SmallModal {
    configsId: number;
    configsName: string;
    configsValue: string;
    codesId: string;
    configsMsg: string;
  }
  const dataSource: Ref<SmallModal[]> = ref([]);
  // dataSource.value = props.dataListSmallModal;
  console.log(props.dataListSmallModal, 'dadad2222');

  watch(
    () => props.visibleSmallModal,
    (nvalue: boolean) => {
      console.log(props, '34');
      visibleSmallModal1.value = nvalue;
    },
    { deep: true },
  );
  let columns = [
    { title: '码值取值', dataIndex: 'configsValue' },
    { title: '编码名称', dataIndex: 'configsName' },
    { title: '编码含义', dataIndex: 'configsMsg' },
  ];
  const emit = defineEmits(['changeShow']);
  const visibleSmallModal1: Ref<boolean> = ref(false);
  const handleCancel = () => {
    visibleSmallModal1.value = false;
    emit('changeShow', 'tableSmall');
  };
</script>
